.app
  font-size: 16rem;
  width: 100vw;
  height: 100vh;
  overflow: hidden;

:root
  --color-active: #ff5f16;
  --color-white: #797d82;
  --color-black: #191a1b;
  --color-supwhite: #fff;
  --color-yellow: #ffb232;

  --bg-active: #ff5f16;
  --bg-base: #f4f4f4;
  --bg-white: #fff;
  --bg-grey: #d2d6dc;
  --bg-greywhite: #ededed;

  --bdc-active: #ff5f16;
  --bdc-yellow: #ffb232;
  --bdc-white: #f4f4f4;

@keyframes displacement-right
  0%
    transform: translateX(-200%)
  100%
    transform: translateX(0)
@keyframes displacement-left
  0%
    transform: translateX(200%)
  100%
    transform: translateX(0)

@keyframes films-enter-opacity
  0%
    opacity: 0
  100%
    opacity: 1
@keyframes films-leave-opacity
  0%
    opacity: 1
  100%
    opacity: 0

// 页面切换过渡动画
.page
  position: absolute
  left: 15px
  right: 15px

.page-enter
  opacity: 0
  transform: translateX(-10px)

.page-enter-active
  opacity: 1
  transform: translateX(0)
  transition: opacity 300ms, transform 300ms

.page-exit
  opacity: 1

.page-exit-active
  opacity: 0
  transition: opacity 300ms
